import React, { Component } from 'react'
// 限制props的传入的类型
// npm i -S prop-types
// number string bool array object any任意类型
import types from 'prop-types'

class Child extends Component {
  // 静态属性
  // static propTypes = {
  //   count: types.number
  // }

  render() {
    return (
      <div>
        <h3>我是Child组件 -- {this.props.count}</h3>
        <hr />
        {this.props.ele}
      </div>
    )
  }
}

// 此写法适用于类和函数组件
Child.propTypes = {
  // isRequired 必须属性
  count: types.number.isRequired,
  // arr: types.array
  // 数组且元素为数字
  arr: types.arrayOf(types.number),
  // user: types.object
  // 限制对象中每个属性它的类型
  user: types.shape({
    id: types.number,
    name: types.string
  }),
  users: types.arrayOf(
    types.shape({
      id: types.number,
      name: types.string
    })
  ),
  // 在指定值中选择一个 字面量
  sex: types.oneOf(['1', '2']),
  // 联合类型
  num: types.oneOfType([types.number, types.string]),
  // 元素类型 node
  ele: types.node,
  // 函数类型
  fn: types.func,
  // 自定义限制
  other: (props, propName) => {
    if (typeof props[propName] != 'string') {
      console.log(111)
      return new Error('类型必须为string')
    }
    if (props[propName].startsWith('admin')) {
      return new Error('不能以admin开头')
    }
  }
}

export default Child
